<template>
	<!-- <view id='outBox'> -->
	<scroll-view scroll-y="true" :scroll-with-animation='true'>
		<view class="no-tontent" v-if="fa == '3'">
			<text>当前问卷已结束发布</text>
			<text>如有问题请联系问卷发布人</text>
		</view>
		<view v-else>
			<view v-if="beijing && beijing != ''" class="bg-img">
				<image class="skinImg" :src="beijing" alt="" />
				<view class="scroll-btn">
					<view class="action-btn" @tap='startAwr'>
						<text>开始答卷</text>
					</view>
				</view>
			</view>
			<view class="header-title">
				<text v-if="yanse && yanse != ''" :style="{color: yanse}">{{title}}</text>
				<text v-else>{{title}}</text>
				<view v-if="showStore" class="title-right flex" @tap="Collect">
					<image :src="show==true?imgurl+'uncollect.png':imgurl+'collect.png'"></image>
					<text>收藏</text>
				</view>
			</view>
			<view class="beizhu" v-if="text">{{text ? text : ''}}</view>
			<view class="main">
				<view class="main-item" v-for="(item,index) in list" :key="index">
					<view v-if="item.showTi == true" :id='"touch"+item.id'>
						<!-- <view v-if="item.pid==1 && item.showItem"> -->
						<view v-if="item.pid==1">
							<view class="item-title">
								<span v-if="item.xuan==2">*</span> 
								<text>{{index+1}}.{{item.ti}}</text>
							</view>
							<radio-group v-if="item.yan == 1" @change="radioChange($event,item)" :data-num="index" :data-id="item.id"
							 :data-xuan="item.xuan">
								<label class="labels" v-for="(el, index) in item.di" :key="el.id">
									<view v-if="el.wen">
										<view>
											<radio :disabled="private" color='#209FFC' style="transform:scale(0.7)" :value="el.id" :checked="el.check" />
											<text>{{el.wen}}</text>
										</view>
										<view v-if="el.img" class="diImg">
											<image :src="el.img" mode=""></image>
										</view>
									</view>
								</label>
							</radio-group>
							<radio-group v-else class="flex_ti flex" @change="radioChange($event,item)" :data-num="index" :data-id="item.id"
							 :data-xuan="item.xuan">
								<label class="labels other flex" v-for="(el, index) in item.di" :key="el.id">
									<view v-if="el.wen">
										<view>
											<radio :disabled="private" color='#209FFC' style="transform:scale(0.7)" :value="el.id" :checked="el.check" />
											<text>{{el.wen}}</text>
										</view>
										<view v-if="el.img" class="diImg">
											<image :src="el.img" mode="widthFix"></image>
										</view>
									</view>
								</label>
							</radio-group>
						</view>
						<view v-if="item.pid==2 && item.showItem">
							<view class="item-title">
								<span v-if="item.xuan==2" style='color: #ff0000;'>*</span>
								<text v-if="item.pid==2">{{index+1}}.{{item.ti}}</text>
								<text v-if="item.zuishao!='不限' && item.zuishao!=null && item.zuiduo!='不限' && item.zuiduo!=null ">[请选择{{item.zuishao}}至{{item.zuiduo}}项]</text>
								<text v-if="item.zuishao!=null && (item.zuiduo=='不限' || item.zuiduo==null)  && item.zuishao!='不限' ">[至少选择{{item.zuishao}}项]</text>
								<text v-if="(item.zuishao=='不限' || item.zuishao==null) && item.zuiduo!='不限' && item.zuiduo!=null ">[至多选择{{item.zuiduo}}项]</text>
							</view> 
							<checkbox-group v-if="item.yan == 1" @change="checkChange($event,item)" :data-num="index" :data-id="item.id"
							 :data-xuan="item.xuan">
								<label class="labels flex" v-for="(el, index) in item.di" :key="el.id">
									<view v-if="el.wen">
										<view>
											<checkbox :disabled="private" color='#209FFC' style="transform:scale(0.7)" :value="el.id" :checked="el.check" />
											<text>{{el.wen}}</text>
										</view>
										<view v-if="el.img" class="diImg">
											<image :src="el.img" mode="widthFix"></image>
										</view>
									</view>
								</label>
							</checkbox-group>
							<checkbox-group v-else class="flex_ti flex" @change="checkChange($event,item)" :data-num="index" :data-id="item.id"
							 :data-xuan="item.xuan">
								<label class="labels other flex" v-for="(el, index) in item.di" :key="el.id">
									<view v-if="el.wen">
										<view>
											<checkbox :disabled="private" color='#209FFC' style="transform:scale(0.7)" :value="el.id" :checked="el.check" />
											<text>{{el.wen}}</text>
										</view>
										<view v-if="el.img" class="diImg">
											<image :src="el.img" mode="widthFix"></image>
										</view>
									</view>
								</label>
							</checkbox-group>
						</view>
						<view v-if="item.pid == 3 && item.showItem">
							<view class="item-title">
								<span v-if="item.xuan==2">*</span>
								<text>{{index+1}}.{{item.ti}}</text>
							</view>
							<input :disabled="private" class="area_box" @blur='regValue($event, item)' :data-order='item.order'
							 :data-index="index" :data-id="item.id" :data-xuan="item.xuan"></input>
						</view>
						<view class="remark_box" v-if="item.pid==4">
							<view class="item-title">
								<text>备注：{{item.beizhu.remark}}</text>
								<view v-if="item.beizhu.img.length > 0" class="img_box">
									<image v-for="el in item.beizhu.img" :src="el.url" mode=""></image>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view v-if="!private && list.length > 0" style="padding-bottom: 60rpx; box-sizing: border-box;">
				<view v-if="yanse && yanse != ''">
					<view v-if="fromUrl == 'cang'" class="bts" :style='{background: yanse}' @tap="Copy">复制问卷</view>
					<view v-else class="bts" :style='{background: yanse}' @tap="save">提交</view>
					<view v-if="guang == 2" class="bts" :style='{background: yanse}' @tap="setModel">设为模板</view>
					<view class="jubao" @tap="Tip">举报</view>
				</view>
				<view v-else>
					<view v-if="fromUrl == 'cang'" class="bts" @tap="Copy">复制问卷</view>
					<view v-else class="bts" @tap="save">提交</view>
					<view v-if="guang == 2" class="bts" @tap="setModel">设为模板</view>
					<view class="jubao" @tap="Tip">举报</view>
				</view>
			</view>
		</view>
	</scroll-view>
	<!-- </view> -->
</template>

<script>
	import api from "@/common/api.js";
	import {
		baseURL
	} from "@/common/http.js";
	import app from "../../App.vue"
	export default {
		data() {
			return {
				imgurl: '',
				show: true,
				text: '',
				title: '',
				yanse: '',
				beijing: '',
				wenid: '',
				list: [],
				values: [],
				key: true,
				nameid: '',
				fromUrl: '', // 页面入口
				guang: '',
				moid: '',
				id: '',
				scrollHeight: 0,
				private: false,
				showStore: true, // 显示收藏按钮
				// cancelSubmit: true
				// 题目 order: '', // 校验类型1~7 ['无', '中文', '英文', '数字', '手机', '邮件', '网址']
				fa: '', //问卷是否可看
			};
		},
		methods: {
			// 设为模板
			setModel() {
				uni.navigateTo({
					url: '../create/create?wenid=' + this.wenid + '&fromUrl=model'
				})
			},
			// 复制问卷
			Copy() {
				let _this = this
				uni.showModal({
					title: '系统提示',
					content: '确定要复制这份问卷吗?',
					confirmColor: '#209FFC',
					success: function(res) {
						if (res.confirm) {
							api.look({
								wenid: _this.wenid,
								table: 1,
								nameid: uni.getStorageSync('message')[0].id,
								api: 'weifu'
							}).then(res => {
								if (res && res.code == 200) {
									uni.showToast({
										title: '复制成功',
										duration: 1500,
										icon: 'none',
										success: () => {
											setTimeout(() => {
												uni.reLaunch({
													url: '../index/index'
												})
											}, 1500)
										}
									})
								}
							}).catch(err => {
								console.log(err)
							})
						} else if (res.cancel) {
							uni.showToast({
								title: '取消复制',
								icon: 'none',
								duration: 1500
							})
						}
					}
				});
			},
			Tip() {
				uni.navigateTo({
					url: '../tip/submitTip/submitTip?wenid=' + this.wenid + '&id=' + this.id + '&type=' + 2
				})
			},
			radioChange(e, item) {
				let values = e.detail.value
				let items = item
				let ids = e.currentTarget.dataset.id
				let num = e.currentTarget.dataset.num
				let xuan = e.currentTarget.dataset.xuan
				this.values[num] = {
					nameid: this.nameid,
					wenid: this.wenid,
					wenidid: ids,
					daid: [e.target.value],
					pid: 1,
					xuan: xuan
				}
				// 显示依赖的题目
				item.di.forEach((el, index) => {
					if (el.dependBy) {
						this.list.forEach((val, i) => {
							if (val.id == el.dependBy) {
								this.$set(val, 'showItem', true)
							}
						})
					}
				})
				// 跳转
				if (item.xuantiao) {
					let idx = ''
					this.list.forEach((el, index) => {
						if (el.id == item.xuantiao) {
							idx = index
						}
					})
					for (let i = 0; i < this.list.length; i++) {
						if (i > num && i <= idx && this.list[i].id != item.xuantiao) {
							this.list[i].showTi ? this.list[i].showTi = false : ''
						}
					}
					this.$forceUpdate()
				}
			},
			checkChange(e, item) {
				let items = item
				let values = e.detail.value
				let ids = e.currentTarget.dataset.id
				let num = e.currentTarget.dataset.num
				let xuan = e.currentTarget.dataset.xuan
				this.values[num] = {
					nameid: this.nameid,
					wenid: this.wenid,
					wenidid: ids,
					daid: e.target.value,
					pid: 1,
					xuan: xuan
				}
				/* item.di.forEach((el, index) => {
					if(index == num) {
						el.check ? el.check == true : el.check == false,
						console.log(el.check)
					}
				}) */
				// 显示依赖的题目
				item.di.forEach((el, index) => {
					if (el.dependBy) {
						this.list.forEach((val, i) => {
							if (val.id == el.dependBy) {
								this.$set(val, 'showItem', true)
							}
						})
					}
				})
				// 跳转
				if (item.xuantiao) {
					let idx = ''
					this.list.forEach((el, index) => {
						if (el.id == item.xuantiao) {
							idx = index
						}
					})
					for (let i = 0; i < this.list.length; i++) {
						if (i > num && i <= idx && this.list[i].id != item.xuantiao) {
							this.list[i].showTi ? this.list[i].showTi = false : ''
						}
					}
					this.$forceUpdate()
				}
			},
			// 校验
			regValue(e, item) {
				let order = e.currentTarget.dataset.order
				let val = e.target.value
				let idx = e.currentTarget.dataset.index
				let ids = e.currentTarget.dataset.id
				let xuan = e.currentTarget.dataset.xuan
				let reg = new RegExp()
				let text = ''
				if (order) {
					switch (parseInt(order)) {
						case 2:
							reg = /[\u4e00-\u9fa5]/;
							text = '中文'
							break;
						case 3:
							reg = /^[A-Za-z]+$/;
							text = '英文'
							break;
						case 4:
							reg = /^[0-9]*$/;
							text = '数字'
							break;
						case 5:
							reg = /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/;
							text = '手机'
							break;
						case 6:
							reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
							text = '邮件'
							break;
						case 7:
							reg = /(https?|http|ftp|file):\/\/[-A-Za-z0-9+&@#\/%?=~_|!:,.;]+[-A-Za-z0-9+&@#\/%=~_|]/;
							text = '网址'
							break;
						default:
							break;
					}
					if (order != 0 && order != 1) {
						if (!reg.test(val)) {
							uni.showToast({
								title: '请规范输入第' + (parseInt(idx) + 1) + '题的' + text,
								icon: 'none',
								duration: 1500
							})
							e.target.value = ''
						}
					}
				}
				this.values[idx] = {
					nameid: this.nameid,
					wenid: this.wenid,
					order: order,
					wenidid: ids,
					wen: val,
					pid: 3,
					xuan: xuan
				};
				// 显示依赖的题目
				if (item.dependBy) {
					this.list.forEach((val, i) => {
						if (val.id == item.dependBy) {
							if (e.target.value != '') {
								this.$set(val, 'showItem', true)
							}
							this.$set(val, 'showItem', false)
						}
					})
				}
				// 跳转
				if (item.xuantiao) {
					let ixd = ''
					this.list.forEach((el, index) => {
						if (el.id == item.xuantiao) {
							ixd = index
						}
					})
					if (e.target.value != '') {
						for (let i = 0; i < this.list.length; i++) {
							if (i > idx && i <= ixd && this.list[i].id != item.xuantiao) {
								this.list[i].showTi ? this.list[i].showTi = false : ''
							}
						}
					}
					this.$forceUpdate()
				}
			},
			save() {
				if (this.values.length > 0) {
					for (let el in this.list) {
						for (let i in this.values) {
							if (this.list[el].xuan == 2 && this.list[el].showTi) {
								if (this.values[el]) {
									if (!this.values[el].daid) {
										if (!this.values[el].wen) {
											uni.showToast({
												title: '第' + (Number(el) + 1) + '题是必答题，请作答',
												icon: 'none',
												duration: 1000
											})
											this.key = false
											break
										} else {
											this.key = true
											continue
										}
									} else if (this.values[el].daid) {
										if (this.values[el].daid.length <= 0) {
											uni.showToast({
												title: '第' + (Number(el) + 1) + '题是必答题，请作答',
												icon: 'none',
												duration: 1000
											})
											this.key = false
											break
										} else {
											this.key = true
											continue
										}
									}
								} else {
									uni.showToast({
										title: '第' + (Number(el) + 1) + '题是必答题，请作答',
										icon: 'none',
										duration: 1000
									})
									this.key = false
									break
								}
							} else {
								this.key = true
								continue
							}
						}
						if (!this.key) {
							break
						}
					}
					if (this.key) {
						if (this.wxpid == 2) {
							if (this.nameid && this.nameid != '') {
								this.submit()
							} else {
								uni.showToast({
									title: '问卷设置了只能通过微信回答，请先用微信登录',
									icon: 'none',
									duration: 2000
								})
							}
						} else {
							this.submit()
						}
					}
				} else {
					uni.showToast({
						title: "请填写问卷",
						icon: 'none',
						duration: 1000
					})
				}
			},

			// 提交
			submit() {
				for (let i in this.list) {
					for (let el in this.values) {
						if ((this.list[el].zuishao || this.list[el].zuishao) && this.list[el].showTi) {
							let sum = 0
							this.list[el].di.forEach((item) => {
								this.values[el].daid.forEach(val => {
									if (item.id == val) {
										sum++
									}
								})
							})
							if (this.list[el].zuishao || this.list[el].zuiduo) {
								if (this.list[el].zuishao && this.list[el].zuishao != '不限') {
									if (sum >= this.list[el].zuishao) {
										this.key = true
										// continue
									} else {
										uni.showToast({
											title: '第' + (parseInt(el) + 1) + '题选项不能少于' + this.list[el].zuishao,
											icon: 'none',
											duration: 2000
										})
										this.key = false
										break
									}
								}
								if (this.list[el].zuiduo && this.list[el].zuiduo != '不限') {
									if (sum <= this.list[el].zuiduo) {
										this.key = true
										// continue
									} else {
										uni.showToast({
											title: '第' + (parseInt(el) + 1) + '题选项不能多于' + this.list[el].zuiduo,
											icon: 'none',
											duration: 2000
										})
										this.key = false
										break;
									}
								}
							}
						}
					}
					if(this.list[i]['pid'] == 3 && this.values[i]['wen']){
						let reg = new RegExp()
						let text = '';
						switch (parseInt(this.list[i]['order'])) {
							case 2:
								reg = /[\u4e00-\u9fa5]/;
								text = '中文'
								break;
							case 3:
								reg = /^[A-Za-z]+$/;
								text = '英文'
								break;
							case 4:
								reg = /^[0-9]*$/;
								text = '数字'
								break;
							case 5:
								reg = /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/;
								text = '手机'
								break;
							case 6:
								reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
								text = '邮件'
								break;
							case 7:
								reg = /(https?|http|ftp|file):\/\/[-A-Za-z0-9+&@#\/%?=~_|!:,.;]+[-A-Za-z0-9+&@#\/%=~_|]/;
								text = '网址'
								break;
							default:
								break;
						}
						if (this.list[i]['order'] != 0 && this.list[i]['order'] != 1) {
							if (!reg.test(this.values[i]['wen'])) {
								uni.showToast({
									title: '请规范输入第' + (parseInt(i) + 1) + '题的' + text,
									icon: 'none',
									duration: 1500
								})
								return
							}
						}
					}
				};
				if (this.key) {
					api.look({
						api: 'wenda',
						data: this.values,
						nameid: this.nameid
					}).then(res => {
						if (res.code == 200) {
							uni.showToast({
								title: '提交成功',
								icon: 'success',
								duration: 2000
							})
						} else if (res.code == 401) {
							uni.showToast({
								title: "问卷被锁",
								icon: 'none',
								duration: 2000
							})
						} else {
							uni.showToast({
								title: '每人只能回答一次',
								icon: 'none',
								duration: 2000
							})
						}
						setTimeout(() => {
							uni.navigateBack({
								delta: -1
							})
							var pages = getCurrentPages()
							var prevPage = pages[pages.length - 2]
							var listNew = prevPage.data.list
							listNew[this.indexNew]['darenshu'] = listNew[this.indexNew]['darenshu'] + 1
							console.log('listNew', listNew);
							prevPage.setData({ list:listNew })
							// uni.redirectTo({
							// 	url: '/pages/questionHAall/questionHAall?wenid=' + this.wenid + "&add=true"
							// })
						}, 2000)
					}).catch(err => {
						console.log(err)
					})
				}
			},
			Collect() {
				if (this.nameid && this.nameid != '') {
					api.look({
						api: 'wencang',
						nameid: this.nameid,
						wenid: this.wenid
					}).then(res => {
						if (res.code == 200) {
							this.show = false
						} else {
							this.show = true
						}
					}).catch(err => {
						console.log(err)
					})
				} else {
					uni.showToast({
						title: '您还没有登录，请先登录',
						icon: 'none',
						duration: 2000
					})
				}
			},
			// 开始
			startAwr() {
				uni.createSelectorQuery().select(".header-title").boundingClientRect(data => { //目标节点
					// uni.createSelectorQuery().select("#outBox").boundingClientRect((res) => { //最外层盒子节点
					uni.pageScrollTo({
						duration: 200, //过渡时间必须为0，uniapp bug，否则运行到手机会报错
						scrollTop: data.top - 0, //滚动到实际距离是元素距离顶部的距离减去最外层盒子的滚动距离
					})
					// }).exec();
				}).exec();
			},
			getTimu() {
				api.look({
					api: 'tables',
					wenid: this.wenid
				}).then(res => {
					res.date.forEach((item1, index1) => {
						if (item1.pid != 3 && item1.pid != 4) {
							item1.di.forEach(el => {
								this.$set(el, 'check', false)
							})
						}
						if (item1.xiantiao) {
							this.$set(item1, 'showItem', false)
						} else {
							this.$set(item1, 'showItem', true)
						}
						if (item1.xuantiao) {
							res.date.forEach((el, index) => {
								if (el.id == item1.xuantiao) {
									item1.xuanIndex = index + 1
								}
							})
						}
					})
					res.date.forEach((el, index) => {
						if (el.xiantiao) {
							let arr = JSON.parse(el.xiantiao)
							res.date.forEach((item, idx) => {
								if (item.id == arr[0].id) {
									el.dependTi = idx + 1
									if (arr[0].di && arr[0].di.length > 0) {
										if (item.pid == 1 || item.pid == 2) {
											item.di.forEach((val, i) => {
												if (val.id == arr[0].di[0]) {
													el.dependItem = i + 1
													this.$set(val, 'dependBy', el.id)
												}
											})
										} else if (item.pid == 3) {
											this.$set(item, 'dependBy', el.id)
										}
									} else {
										if (item.pid == 1 || item.pid == 2) {
											item.di.forEach((val, i) => {
												this.$set(val, 'dependBy', el.id)
											})
										} else {
											this.$set(item, 'dependBy', el.id)
										}
									}
								}
							})
						}
					})
					this.list = res.date
					this.list.map((item, index) => {
						item.show = false
						item.showTi = true
						if (item.pid == 4) {
							item.beizhu = JSON.parse(item.beizhu)
						}
						// ////////////////////
						this.values[index] = {
							nameid: this.nameid,
							wenid: item.wenid,
							wenidid: item.id,
							pid: item.pid,
							xuan: item.xuan
						}
						if (item.pid == 1 || item.pid == 2){
							this.values[index]['daid'] = []
						} else if (item.pid == 3) {
							this.values[index]['wen'] = ''
						}
					})
				}).catch(err => {
					console.log(err)
				})
			}
		},
		onShareAppMessage(options) {
			let shareObj = {
				title: this.title ? this.title : '', // 默认是小程序的名称(可以写slogan等)
				path: '/pages/questionHallDetial/questionHallDetial?wenid=' + this.wenid, // 默认是当前页面，必须是以‘/’开头的完整路径
				imageUrl: '', //自定义图片路径，可以是本地文件路径、代码包文件路径或者网络图片路径，支持PNG及JPG，不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
				success: (res) => {
					// 转发成功之后的回调
					if (res.errMsg == 'shareAppMessage:ok') {
						uni.showToast({
							title: '分享成功',
							icon: 'success',
							duration: 1500
						})
					}
				},
				fail: () => {
					// 转发失败之后的回调
					if (res.errMsg == 'shareAppMessage:fail cancel') {
						// 用户取消转发
						uni.showToast({
							title: '取消分享',
							icon: 'none',
							duration: 2000
						})
					} else if (res.errMsg == 'shareAppMessage:fail') {
						// 转发失败，其中 detail message 为详细失败信息
					}
				},
				complete: () => {
					// 转发结束之后的回调（转发成不成功都会执行）
				}
			}
			return shareObj
		},
		onLoad(options) {
			if (options.qusType) {
				options.qusType == 1 ? this.showStore = false : this.showStore = true
			}
			if (options.fromUrl) {
				this.fromUrl = options.fromUrl
			}
			if (options.private) {
				this.private = options.private
			}
			this.imgurl = app.globalData.imgurl
			this.wenid = options.wenid
			this.indexNew = options.index
			if (uni.getStorageSync('message')) {
				this.guang = uni.getStorageSync('message')[0].guang
				this.nameid = uni.getStorageSync('message')[0].id
				this.call = uni.getStorageSync('message')[0].call
			} else {
				this.guang = ''
				this.nameid = ''
				/* uni.showModal({
					title: '提示',
					content: '您还未登录小程序，请先登录',
					confirmText: '登录',
					cancelText: '返回',
					success: (res) => {
						if (res.confirm) {
							setTimeout(() => {
								uni.navigateTo({
									url: '../login/login'
								})
							}, 500)
						} else if (res.cancel) {
							uni.navigateBack({
								delta: -1
							})
						}
					}
				}) */
			}
			api.editSur({
				api: 'wenfind',
				shu: '1',
				table: '3',
				wenid: options.wenid,
				nameid: this.nameid
			}).then(res => {
				console.log('zoule',res)
				if (res.code == 200) {
					if (res.date[0].shoucan == 2) {
						this.show = false
					}
					if (res.date[0].fa == 2) {
						this.fa = 2
						this.title = res.date[0].namewenid
						this.id = res.date[0].id
						this.name = res.date[0].name
						this.wxpid = res.date[0].wxpid
						this.yanse = res.date[0].yanse ? res.date[0].yanse : ''
						this.beijing = res.date[0].beijing ? res.date[0].beijing : ''
						this.text = res.date[0].text  //问卷说明
						this.getTimu()
					} else {
						this.fa = 3
						// fa: 3
						// uni.showToast({
						// 	title: '当前问卷已结束发布，如有问题请联系问卷发布人',
						// 	icon: 'none',
						// 	duration: 2000,
						// 	success: () => {
						// 		setTimeout(() => {
						// 			uni.navigateTo({
						// 				url: '../questionHAall/questionHAall'
						// 			})
						// 		})
						// 	}
						// })
					}
				} else {
					uni.showToast({
						title: "查询失败",
						duration: 1000,
						icon: 'none'
					})
				}
			}).catch(err => {
				console.log(err)
			})
		}
	}
</script>

<style lang="scss">
	.bg-img {
		width: 100%;
		height: 100vh;
		position: relative;

		.skinImg {
			width: 100%;
			height: 100vh;
		}

		.scroll-btn {
			width: 100%;
			position: absolute;
			bottom: 200rpx;
			text-align: center;

			.action-btn {
				width: 35%;
				margin: 0 auto;
				border-radius: 45rpx;
				line-height: 90rpx;
				padding: 0 20rpx;
				box-sizing: border-box;
				background-color: rgba($color: #FFFFFF, $alpha: 0.5)
			}
		}
	}

	.area_box {
		background-color: #FFFFFF;
		width: 100%;
		padding: 0 20rpx;
		line-height: 80rpx;
		height: 80rpx;
		box-sizing: border-box;
		border-radius: 10rpx;
	}

	page {
		background: #F0F0F0;
		font-weight: 500;
	}

	span {
		color: #ff0000;
	}

	.header-title {
		color: #209FFC;
		text-align: center;
		position: relative;
		padding: 30rpx;
		padding-top: 70rpx;
		font-weight: bold;
		box-sizing: border-box;
		font-size: 40rpx;

		.title-right {
			position: absolute;
			height: 100rpx;
			line-height: 100rpx;
			top: 0;
			right: 20rpx;

			image {
				height: 50rpx;
				width: 50rpx;
			}

			text {
				font-size: 24rpx;
				color: #999;
			}
		}
	}

	.beizhu {
		width: 690rpx;
		padding: 20rpx 0;
		box-sizing: border-box;
		margin: 0 auto;
		color: #666;
		font-size: 24rpx;
	}

	.main-item {
		width: 100%;
		margin-bottom: 10rpx;

		.item-title {
			padding: 15rpx 0;
			box-sizing: border-box;
			display: flex;
			align-items: flex-start;
			._span {
				display: inline-block;
				width: 25rpx;
			}
			text {
				display: block;
				flex: 1;
				color: #333;
				font-size: 34rpx;
			}
		}
	}

	.main {
		width: 100%;
		padding: 20rpx;
		box-sizing: border-box;
	}

	.labels {
		margin: 5rpx 0;
		// min-height: 60rpx;
		line-height: 60rpx;
		width: 100%;
		flex-wrap: wrap;
		color: #666;

		.diImg {
			width: 60%;
			// height: 200rpx;
			padding: 10rpx 0;
			box-sizing: border-box;

			image {
				max-width: 100%;
				max-height: 100%;
				object-fit: contain;
			}
		}
	}


	.bts {
		width: 690rpx;
		height: 100rpx;
		background: #209FFC;
		border-radius: 50rpx;
		line-height: 100rpx;
		text-align: center;
		color: #fff;
		font-size: 36rpx;
		margin: 50rpx auto;
	}

	.jubao {
		color: #999;
		font-size: 30rpx;
		text-align: right;
		width: 690rpx;
		margin: 0rpx auto;
	}

	.remark_box {
		padding-bottom: 30rpx;
		box-sizing: border-box;

		.img_box {
			width: 100%;
			height: 200rpx;

			image {
				width: 33%;
				height: 100%;
				margin-top: 20rpx;
			}
		}
	}

	.flex_ti {
		width: 100%;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;

		.other.labels {
			width: 100%;
		}
	}
	
	.no-tontent {
		height: 85vh;
		width: 100vw;
		overflow: hidden;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		font-size: 30rpx;
		text {
			display: block;
			line-height: 50rpx;
			color: #666;
		}
	}
</style>
